/**
Theme Name: JVAL 2024
Author: N. Jones & M. Baiutti
Author URI: http://wpastra.com/about/
Description: JVAL 2024 is built on top of Astra
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/**
COLORS 2023
Red    #E40E20
Black  #000000
White  #ffffff
Grey   #C9C9C9
Text grey #A0A0A0
*/

/*** FONTS ***/
/* Diglu (2022) */
/*@import url('fonts/diglu-regular.css');*/
/*@import url('fonts/diglu-extrabold.css');*/
/*@import url('fonts/Gt-America.css');*/

/* GT Cinetype (2023) */
/* @font-face {
  font-family: 'Gt-Cinetype';
  src: url('fonts/Gt-Cinetype-Bold.woff2') format('woff2'),
    url('fonts/Gt-Cinetype-Bold.woff') format('woff'),
    url('fonts/Gt-Cinetype-Bold.ttf') format('truetype');
} */

/* GT America (2024) */
@font-face {
  font-family: 'Gt-America';
  src: url('fonts/GT-America-Standard-Medium.woff2') format('woff2'),
    url('fonts/GT-America-Standard-Medium.woff') format('woff'),
    url('fonts/GT-America-Standard-Medium.ttf') format('truetype');
}

html {
  font-size: 16px;
}

/* Media breaks 780px */
h1,
.entry-content h1,
h2,
.entry-content h2,
h3,
.entry-content h3,
h4,
.entry-content h4,
h5,
.entry-content h5,
h6,
.entry-content h6 {
  font-family: 'Gt-America';
}

body {
  font-family: 'Gt-America';
}

.ast-button,
.button,
button,
input,
select,
textarea {}

.wp-block-button .wp-block-button__link {
  text-transform: uppercase;
  font-family: 'Gt-America';
}


/** GLOBAL LAYOUT **/
/* title on mobile */
/* @media (max-width: 800px) {
  .ast-single-post h1.entry-title,
  .page-title {}
} */

hr.alignwide {
  border: 1px solid #000000;
}

/* Headings's typography: Jack / XLR / Volume */
h1 {
  padding-left: 0.9em;
  text-transform: uppercase;
}
h1::before {
  background: url(images/xlr-white.svg) no-repeat;
  width: 0.7em;
  height: 0.7em;
  display: block;
  content: '';
  position: absolute;
  background-position: left;
  background-size: contain;
  margin-left: -0.9em;
  margin-top: 0.275em;
}
h1::before.white {
  background: url(images/xlr-white.svg) no-repeat;
}
h1::before.black {
  background: url(images/xlr-black.svg) no-repeat;
}

h2 {
  padding-left: 1em;
}
h2::before {
  background: url(images/jack-white.svg) no-repeat;
  width: 0.75em;
  height: 0.75em;
  display: block;
  content: '';
  position: absolute;
  background-position: left;
  background-size: contain;
  margin-left: -1em;
  margin-top: 0.27em;
}
h2::before.white {
  background: url(images/jack-white.svg) no-repeat;
}
h2::before.black {
  background: url(images/jack-black.svg) no-repeat;
}

h3 {
  padding-left: 1em;
}
h3::before {
  background: url(images/volume-white.svg) no-repeat;
  width: 0.75em;
  height: 0.75em;
  display: block;
  content: '';
  position: absolute;
  background-position: left;
  background-size: contain;
  margin-left: -1em;
  margin-top: 0.25em;
}
h3::before.white {
  background: url(images/volume-white.svg) no-repeat;
}
h3::before.black {
  background: url(images/volume-black.svg) no-repeat;
}

/* MENU navigation 2024 */
.ast-builder-menu-1 {
  border: 2px solid white;
  border-radius: 10px;
  height: 60px;
}
.ast-builder-menu-1 .main-header-menu>ul {
  background-color: transparent;
}
.ast-builder-menu-1 .main-header-menu {
  background-color: transparent;
}

/* LIGHT / DARK MODE */
body.light-theme {
  --ast-global-color-0: #ffffff;
  --ast-global-color-1: #ff5000;
  --ast-global-color-2: #ffffff;
  --ast-global-color-3: #c9c9c9;
  --ast-global-color-4: #000000;
  --ast-global-color-5: #FFFFFF;
  --ast-global-color-6: #F2F5F7;
  --ast-global-color-7: #ff7126;
  --ast-global-color-8: #F8440E;
}
body.dark-theme {
  --ast-global-color-0: #ffffff;
  --ast-global-color-1: #121212;
  --ast-global-color-2: #ffffff;
  --ast-global-color-3: #c9c9c9;
  --ast-global-color-4: #ff5000;
  --ast-global-color-5: #FFFFFF;
  --ast-global-color-6: #F2F5F7;
  --ast-global-color-7: #ff7126;
  --ast-global-color-8: #000000;
}
/* toggle switch */
.mode {
  height: 60px;
  width: 30px;
  background-size: contain;
  transition-timing-function: ease-out;
}
.light-theme .mode {
  background-image: url(images/switch-off.svg);
}
.dark-theme .mode {
  background-image: url(images/switch-on.svg);
}


/* HEADER */

/* HERO 2024 */ 
#hero24 {
  --test: 100vw;
  height: 80vh;
  padding-top: 0px;
  background-image: url(images/hero-horse.svg);
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: auto calc(95%);
  /* border: 1px solid red; */
}
#hero24 .container {
  position: relative;
  /* border: 1px solid greenyellow; */
}
#hero24 #hero-cable {
  --height: calc(70vh * 0.95);
  --negative: calc(-1 * (var(--height) / 2.8));
   /* border: 1px solid white;*/ 
  position: absolute;
  top: 0;
  left: var(--negative);
  height: var(--height);
  width: calc(var(--test) + (-1 * (var(--negative) / 2)));
  overflow: hidden;
  background-image: url(images/hero-cables.svg);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: auto 100%;
}
.dark-theme #hero24 {
  background-image: url(images/hero-horse-dark.svg);
}
.dark-theme #hero24 #hero-cable {
  background-image: url(images/hero-cables-dark.svg);
}
.light-theme #hero24 {
  background-image: url(images/hero-horse.svg);
}
#hero24 h1 {
  --ref: calc(70vh * 0.8);
  padding-left: 0px;
  font-size: 5em;
  line-height: 1em;
  padding-top: calc(var(--ref) * 0.25);
}
#hero24 h1::before {
  background-image: none;
  width: 0px;
  margin-left: 0px;
  margin-right: 0px;
  content: none;
}
#post-7734 header.entry-header.ast-no-title {
  display: none;
}
@media (max-width: 980px) {
  #hero24 .container {
    --cwidth: 100%;
  }
  #hero24 #hero-cable {
    --height: calc(70vh * 0.8);
    width: calc(var(--cwidth) + 4em + (-1 * var(--negative)));
    left: var(--negative);
  }
  #hero24 h1 {
    font-size: 3.5em;
  }
  #hero24, .light-theme #hero24  {
    background-size: auto calc(60%);
  }
}
@media only screen and (max-width: 780px) {
  #hero24 .container {
    --cwidth: 100%;
  }
  #hero24 #hero-cable {
    --height: calc(70vh * 0.8);
    width: calc(var(--cwidth) + 3em + (-1 * var(--negative)));
    left: var(--negative);
  }
  #hero24 h1 {
  }
}


/* HERO 2023 dancing hair */
#hero, #hero .wp-block-group__inner-container {
  position: relative;
  width: 100%;
  height: 80vh;
}
@media only screen and (max-width: 780px) {
  #hero, #hero .wp-block-group__inner-container {
    height: 50vh;
  }
}

#hero h2 {
  font-size: 8vw;
  text-transform: uppercase;
}

#hero h2.line1 {
  position: absolute;
  margin-top: 10vh;
  /* z-index: 1; */
}
#hero figure, #hero img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);

  /*min-height: 80vh;*/
  width: 75%;
  /* z-index: 2; */
}
#hero h2.line3 {
  position: absolute;
  top: 50%;
  right: 0;
  /* z-index: 3; */
}

#hero h2.line2 {}
#hero h2.line4 {}

/* Home background spotlights */
body.home #content.site-content {
  /* background: url('https://www.jval.ch/site/wp-content/uploads/2023/06/spotsHeader-low-.jpg') top center;*/
  background-repeat: no-repeat;
  background-size: contain;
}


/** PROGRAM / GROUP **/
/* Home */
.home h2 {
  font-size: 6vw;
}
@media (max-width: 980px){
  .home h2 {
    font-size: 9vw;
  }
}
/* Program */
.program h4 {
  text-transform: uppercase;
  font-size: 3em;
}
.program .wp-block-image img {
  opacity: 0.8;
}
.program .wp-block-image:hover img {
  opacity: 1;
}
.program figcaption {
  font-family: 'Gt-America';
  font-size: 2em;
  text-transform: uppercase;
  line-height: 1em;
  position: relative;
  top: calc(-1em - 8px);
  left: 8px;
  margin-top: 0px;
}
.program figcaption {
  font-family: 'Gt-America';
}
.program #djs figcaption {
  color: var(--ast-global-color-0);
}

@media (max-width: 1055px) and (min-width: 781px) {
  .program figcaption {
    font-size: 1.4em;
  }
  .program h4 {
    font-size: 2em;
  }
}
@media (max-width: 780px) {
  .program figcaption {
    font-size: 2em;
  }
}
/* Phychotic Two Liner */
@media (min-width: 1055px) and (max-width: 1213px) {
  .program .psychotic figcaption {
    top: calc(-2em - 8px);
    margin-bottom: -32px;
  }
}
@media (max-width: 980px) {
  .program .psychotic figcaption {
    top: calc(-2em - 8px);
    margin-bottom: -32px;
  }
}

/* .program .wp-block-columns.has-background {
  padding-left: 0px;
  padding-right: 0px;
} */


#informations-pratiques h4 a {
  text-decoration: none;
  text-transform: uppercase;
  font-size: 3vw;
}
@media (max-width: 780px) {
  #informations-pratiques h4 a {
    font-size: 5vw;
  }
}
#informations-pratiques h4:hover a {
  color: var(--ast-global-color-0);
}
#informations-pratiques .wp-block-cover .wp-block-cover__image-background {
  object-fit: contain;
}
#informations-pratiques .first {
  background-image: url(images/localisation-black.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
#informations-pratiques .second {
  background-image: url(images/navettes-black.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
#informations-pratiques .third {
  background-image: url(images/restauration-black.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.dark-theme #informations-pratiques .first {
  background-image: url(images/localisation-white.svg);
}
.dark-theme #informations-pratiques .second {
  background-image: url(images/navettes-white.svg);
}
.dark-theme #informations-pratiques .third {
  background-image: url(images/restauration-white.svg);
}

/* bug in stylesheet page titles size not respected */
.category-programme h1 {
  font-size: 6em;
}
.category-programme pre {
  background: inherit;
  font-family: 'Gt-America';
  margin-bottom: 0.6em;
  overflow: auto;
  max-width: 100%;
  text-transform: uppercase;
  color: var(--ast-global-color-4);
  font-size: 1.4em;
  padding: 0px;
  font-weight: 500;
}

.program .link a {
  color: #41FB30;
}

.category-programme .wp-block-buttons {
  margin-bottom: 1.6em;
}

/* hide meta on group */
.entry-meta {
  display: none;
}

/** BILLETTERIE **/
.billetterie-card {
  background-color: var(--ast-global-color-4);
}

.billetterie-card p {
  color: var(--ast-global-color-0);
  padding-left: 10px;
  padding-right: 10px;
  text-transform: uppercase;
}

.billetterie-card .wp-block-button {
  padding-bottom: 10px;
}

.wp-block-button.billets a::before {
  background: url(images/volume-white.svg) no-repeat;
  width: 1em;
  height: 1em;
  display: block;
  content: '';
  position: absolute;
  background-position: left;
  background-size: contain;
  margin-left: -1.5em;
  margin-top: 0em;
}
.wp-block-button.billets:hover a::before {
  background-image: url(images/volume-orange.svg);
}
.light-theme .wp-block-button.billets:hover a::before {
  background-image: url(images/volume-black.svg);
}
.wp-block-button.billets a {
  padding-left: 2.5em !important;
}


/** SPONSORS **/
#sponsors {
  margin-top: 20px;
  margin-bottom: 20px;
}

#sponsors h3 {
  font-size: 1rem;
}

/** INSTAGRAM **/
#sb_instagram .sbi_btn_text {
  text-transform: uppercase;
  font-family: 'Gt-America';
}

#sb_instagram .sbi_follow_btn svg {
  margin-right: 0px;
}

/** NEWSLETTER **/
#mc_embed_signup {
  background-color: black !important;
  border: 1px solid white;
}


/** STICKY HEADER HACK **/
/** https://cgscomputer.com/how-to-create-a-sticky-header-with-the-free-astra-wordpress-theme **/


.hide {
  display: none;
}

/* Line-height bug */
.has-large-font-size {
  line-height: var(--wp--preset--font-size--large);
}